<%
/**
 *  listFrame 员工frame
 * 
 * @author  李荣华
 * @version v1.0
 * @date    2017-12-02
 * @since   JSP 2.3.1
 */
%>
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib prefix="at" uri="http://www.jketing.com/at"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/>
<meta content="no-cache" http-equiv="Pragma"/>
<meta content="no-cache" http-equiv="Cache-Control"/>
<meta content="0" http-equiv="Expires"/>
<meta name="GENERATOR" content="MSHTML 8.00.6001.18854"/>
<link rel="stylesheet" id="listFrame" type="text/css" href="<at:url css="listFrame.css"/>" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/scripts/common/zTree/zTreeStyle/zTreeStyle.css" />
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/jquery.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/common.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/scripts/common/zTree/jquery.ztree.all.min.js"></script>
<script type="text/javascript">
	var zTree;
	var zNodes = ${topTree};
	var setting = {
		data: {
			simpleData: {
				enable: true,
				idKey: "id",
				pIdKey: "pId"
			}
		},
		async: {
			enable: true,
			type:"get",
			url: "${pageContext.request.contextPath}/organ/getSubTree",
			autoParam: ["id"]
		},
		callback: {
			onClick: zTreeOnClick
		}
	};
	
	function initTree() {
		$.fn.zTree.init($("#tree"), setting, zNodes);
		zTree = $.fn.zTree.getZTreeObj("tree");
	}
	
	function zTreeOnClick(event, treeId, treeNode) {
		var randomNumber = Math.random();
		var url = "${pageContext.request.contextPath}/employee/list?nodeId="
				+ treeNode.id + "&randomNumber=" + randomNumber;
		document.getElementById("fList").src = url;
	}
	
	function zTreeOnAsyncError(event, treeId, treeNode, XMLHttpRequest, textStatus, errorThrown) {
		alert("Error");
	}
	
	//异步刷新树形节点
	function refreshNode() {
		var type = "refresh"; //只做刷新，不追加 
        var silent = false;//展开父节点  
		var nodes = zTree.getSelectedNodes();
		if (nodes.length>0) {
			var node = nodes[0];
			node.isParent = true;//把属性变成true，让这个节点被认为是父节点才会触发reAsyncChildNodes方法
			zTree.reAsyncChildNodes(nodes[0],type,silent);
		}
	}
	
	//取机构数据
	function getTree(obj){
		var id=obj.options[obj.options.selectedIndex].value;
		$.getJSON("${pageContext.request.contextPath}/organ/getTree?id="+id,function(data){
			zNodes = data;
			initTree();
		}); 
	}
	
	$(document).ready(function(){
		initTree();	
		var url = "${pageContext.request.contextPath}/employee/list?nodeId=${rootId}";
		$("#fList").attr("src",url);
	});
</script>
</head>
<body>	
	<!-- 位置 -->
	<div style="margin-left: 10px;margin-top: 10px">当前位置：<a href="#">基础信息</a>-&gt;<font color="#ff0000">组织机构</font></div>
	<div class="list_frame_left1">
		<select name="root" style="width: 197px;height: 24px;"
			onchange="getTree(this);">
			<c:forEach items="${list}" var="item">
				<option value="${item.id}">${item.name}</option>
			</c:forEach>
		</select>
	</div>
	<div class="list_frame_left2">
		<ul id="tree" class="ztree"></ul>
	</div>
	<div class="list_frame_right">
		<iframe width="100%" height="100%" scrolling="no" align="top" id="fList"
			name="main" frameborder="0"></iframe>
	</div>
</body>
</html>
